<template>
	<z-common-box boxShadow marginTop="35rpx">
		<view class="flex flex-ai-center flex-js-sb mb-12">
			<w-big-title title="抽签流程"></w-big-title>
			<view @click="noteShow = true" class="flex flex-ai-center">
				<u-icon name="/static/img/icon/icon_explain.png" size="18"></u-icon>
				<view class="font-color-999 font-size-14 font-w-bold ml-2">说明</view>
			</view>
		</view>
		<view class="flex flex-ai-center flex-js-sa">
			<view  class="flex flex-dir-col flex-ai-center">
				<view class="flex flex-ai-center">
					<!-- <z-icon v-if="signUpStatus == 1" name="icon_fk_no" size="10"></z-icon>
					<z-icon v-if="signUpStatus == 2" name="icon_cq" size="10"></z-icon>
					<z-icon v-if="signUpStatus == 3" name="shiyuan" size="10"></z-icon>
					<view v-if="signUpStatus == 1" class="font-size-14 ml-4 font-color-999">抽签</view>
					<view v-else-if="signUpStatus == 2" class="font-size-14 ml-4 font-color-theme">抽签</view>
					<view v-if="signUpStatus == 3" class="font-size-14 ml-4 font-color-theme_title font-w-bold">抽签</view> -->
					<!-- <w-icon  name="icon_cq" size="10"></w-icon> -->
					<view  class="font-size-14 ml-4 font-color-666">抽签时间</view>  
				</view>	
				<view class="font-size-10 mt-10">{{product.goods_type == 2?product.batch.sign_up_start_time:product.sign_up_start_time|formatDate}}</view>		
				<view class="mt-10 font-size-12 font-color-theme_title font-w-bold">{{product.goods_type == 2?product.batch.sign_up_start_time:product.sign_up_start_time|formatTime}}</view>		
			</view>
			<u-line color="#CCCCCC" length="40"></u-line>
			<view v-if="product.goods_type == 2 && product.batch" class="flex flex-dir-col flex-ai-center">
				<view class="flex  flex-ai-center">
					<!-- <w-icon  name="icon_cq" size="10"></w-icon> -->
					<view class="font-size-14 ml-4 font-color-666">付款时间</view>
				</view>	
				<view class="font-size-10 mt-10">{{product.batch.sign_up_end_time|formatDate}}</view>		
				<view class="mt-10 font-size-12 font-color-theme_title font-w-bold">{{product.batch.sign_up_end_time|formatTime}}</view>		
			</view>
			<u-line v-if="product.goods_type == 2 && product.batch" color="#CCCCCC" length="40"></u-line>
			<view v-if="product.goods_type == 2 && product.batch" class="flex flex-dir-col flex-ai-center">
				<view class="flex  flex-ai-center">
					<!-- <w-icon  name="icon_cq" size="10"></w-icon> -->
					<view class="font-size-14 ml-4 font-color-666">结束时间</view>
				</view>	
				<view class="font-size-10 mt-10">{{product.batch.end_time * 1000|formatDate}}</view>		
				<view class="mt-10 font-size-12 font-color-theme_title font-w-bold">{{product.batch.end_time * 1000|formatTime}}</view>		
			</view>
		</view>
		<u-gap height="1rpx" bgColor="#F5F5F5" marginTop="25" marginBottom="25"></u-gap>
		<view class="flex flex-ai-center flex-js-sb">
			<view class="flex flex-dir-col" v-if="signUpStatus==3&&info.whether_res == 1&&info.my_code.length&&saleStatus == 2">				
				<view class="font-color-theme_title font-w-bold font-size-16">{{draw_type_text[1].text1}}</view>
				<view class="font-color-666 font-size-12 mt-10">{{draw_type_text[1].text2}}</view>
			</view>
			<view class="flex flex-dir-col" v-else-if="signUpStatus==3&&info.whether_res == 0&&info.my_code.length">
				<view class="font-color-theme_title font-w-bold font-size-16">{{draw_type_text[0].text1}}</view>
				<view class="font-color-666 font-size-12 mt-10">{{draw_type_text[0].text2}}</view>
			</view>
			<view class="" v-else>
				请等待结果
			</view>
			<view @click="ResultJump" v-if="info.whether_res != -1" class="flex flex-ai-center font-color-subtitle font-size-14">中签结果></view>
		</view>
		<z-model @confirm="noteShow = false" :parse="appConfig.draw_lots_notice" :show="noteShow" title="抽签说明" is_show_btn :cancelShow="false" confirmText="知道了"></z-model>
	</z-common-box>
</template>

<script>
	import { mapState } from "vuex"
	import drawMixin from '@/mixins/draw.js'
	import productMixin from '@/mixins/product.js'
	import dayjs from 'dayjs'
	export default {
		name:'currentDrawProcess',
		mixins:[drawMixin,productMixin],
		props:{
			product: {
				type: Object,
				default () {
					return {}
				}
			},
			info: {
				type: Object,
				default () {
					return {
						whether_res:'-1'
					}
				}
			},
		},
		filters:{
			formatDate(v){
				return dayjs(v).format('MM月DD日')
			},
			formatTime(v){
				return dayjs(v).format('HH:mm')
			}
		},
		computed:{
			...mapState('config',{
				config(state){
					return state.info
				}
			}),
			currentStep(){
				// let status = 1
				// if(this.signUpStatus == 1 )
			}
		},
		data(){
			return {
				noteShow:false,  //说明弹框
				type:0,
				processList:{
					0:{
						titleColor:'#B67930',
						dateColor:'#666666',
						timeColor:'#222'
					},
					1:{
						titleColor:'#999999',
						dateColor:'#999999',
						timeColor:'#999999'
					},
					2:{
						titleColor:'#222',
						dateColor:'#666666',
						timeColor:'#222'
					}
				},
				draw_type_text:{
					'-1':{
						text1:'未开奖',
						text2:'敬请期待'
					},
					0:{
						text1:'很遗憾，未中签',
						text2:'不要灰心，下次一定！'
					},
					1:{
						text1:'恭喜您，中签啦！',
						text2:'再接再励！'
					}
				}
			}
		},
		methods:{
			//中签结果跳转
			ResultJump(){
				let data = {
					goods_id:this.drawBase.id,
					goods_type:this.product.goods_type
				}
				uni.navigateTo({
					url:'/pages/draw/drawResult/drawResult?data=' + JSON.stringify(data)
				})		
			}
		}
	}
</script>

<style scoped lang="scss">
	.type_title {
		padding: 8rpx;
		border: 1rpx solid;
		border-radius: 8rpx;
	}
</style>